/* mermaid 图表样式 */
.mermaid {
  margin: 0.5em 0;
  font-size: 13px;
  /* 重新设计容器设置 */
  width: 100%;
  min-height: 200px;
  max-height: 600px;
  overflow: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  /* 添加内边距，避免SVG紧贴边界 */
  padding: 16px;
  box-sizing: border-box;
  /* 添加拖拽和缩放支持 */
  cursor: grab;
  position: relative;
  background: var(--md-mermaid-bg);
}

.mermaid:active {
  cursor: grabbing;
}

/* 缩放控制按钮 */
.mermaid-controls {
  position: absolute;
  bottom: 10px;
  right: 10px;
  z-index: 10;
  display: none;
  gap: 5px;
}

.mermaid:hover .mermaid-controls {
  display: flex;
}

.mermaid-controls button {
  background: var(--md-mermaid-control-bg);
  color: white;
  border: none;
  border-radius: 2px;
  padding: 3px 6px;
  cursor: pointer;
  font-size: 10px;
  font-weight: normal;
  transition: all 0.2s ease;
  min-width: 20px;
}

.mermaid-controls button:hover {
  background: var(--md-mermaid-control-hover-bg);
}

/* 调整 mermaid 图表中的文本大小 */
.mermaid .node rect,
.mermaid .node circle,
.mermaid .node ellipse,
.mermaid .node polygon,
.mermaid .node path {
  font-size: 13px;
  /* 调整节点大小 */
  rx: 5px;
  ry: 5px;
}

.mermaid .label {
  font-size: 13px;
}

/* 调整连接线粗细 */
.mermaid .edgePath path {
  stroke-width: 1.5px;
}

/* 调整箭头大小 */
.mermaid .marker {
  transform: scale(0.8);
}

/* 确保图形容器正确显示 */
.mermaid svg {
  /* 重新设计SVG限制 */
  max-width: 100%;
  max-height: 100%;
  /* 确保内容适应容器 */
  display: block;
  /* 添加缩放和拖拽支持 */
  transform-origin: 0 0;
  transition: transform 0.2s ease;
}
